<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>块状元素和行内元素</title>

    <style>
        /*块状元素有行高属性*/
        div{
            width: 100px;
            height: 100px;
            background: tomato;
        }

        /*行内元素没有宽高属性，它的宽高由里面的文本变换*/
        span{
            width: 100px;
            height: 100px;
            background: cyan;
        }

        a{
            width: 100px;
            height: 100px;
            background: antiquewhite;
        }


    </style>


</head>
<body>

<div>我是块状元素，独占一行</div>

<span>我是行内元素，我不会独占一行</span>

<a href="">A标签也是行内元素</a>



</body>
</html>